import { View } from "@tarojs/components";
import {  useState } from "react";
import { useValidateCode } from "@/hooks/useValidateCode"
import styles from "./index.module.scss";


import SendCode from "./SendCode";
import ValidateCode from "./ValidateCode";

const MobileLogin = () => {

  const { seconds, setSeconds } = useValidateCode();
  const [mobile, setMobile] = useState<{ phone: string, code: string }>({ phone: "", code: "+86" });
  

  const send = (data) => {
    setSeconds(59);
    setMobile(data)
  }


  return (
    <View className={styles["mobile-login"]}>
      {seconds !== 0 ? <ValidateCode seconds={seconds} mobile={mobile}/> : <SendCode send={send} mobile={mobile}/>}
    </View>
  );
};

export default MobileLogin;
